<template>
  <el-dialog
    :title="isEdit ? '编辑公告' : '新增公告'"
    v-model="visible"
    width="600px"
  >
    <el-form :model="form" label-width="80px">
      <el-form-item label="公告标题" required>
        <el-input v-model="form.title" />
      </el-form-item>
      <el-form-item label="公告类型" required>
        <el-select v-model="form.type">
          <el-option label="系统公告" value="system" />
          <el-option label="考试公告" value="sys_exam" />
        </el-select>
      </el-form-item>
      <el-form-item label="公告内容" required>
        <el-input v-model="form.content" type="textarea" :rows="5" />
      </el-form-item>
      <el-form-item label="发布状态">
        <el-switch
          v-model="form.status"
          :active-value="'active'"
          :inactive-value="'inactive'"
        />
      </el-form-item>
    </el-form>

    <template #footer>
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="handleSubmit">确定</el-button>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import { ref, watch } from 'vue'
import { useNoticeStore } from '../../stores/notice/noticeStore'
import type { NoticeInsertVO } from '@/api/notice/types'

const props = defineProps({
  modelValue: Boolean,
  noticeId: Number
})

const emit = defineEmits(['update:modelValue', 'refresh', 'error'])

const store = useNoticeStore()
const visible = ref(props.modelValue)
const isEdit = ref(false)
const form = ref({
  title: '',
  content: '',
  publisherId: 1, // 实际应从用户信息中获取
  status: 'inactive', // 'active' 或 'inactive'
  type: 'system', // 'system' 或 'sys_exam'
  isPinned: 0, // 0未置顶，1置顶
  userIds: [1] // 测试用，实际应为选中的用户id数组
});

watch(() => props.modelValue, (val) => {
  visible.value = val
  if (val) initForm()
})

watch(visible, (val) => {
  emit('update:modelValue', val);
});

const initForm = async () => {
  isEdit.value = !!props.noticeId;
  if (isEdit.value && props.noticeId) {
    const res = await store.getNoticeDetail(props.noticeId);
    const data = res.data;
    form.value = {
      title: data.title,
      content: data.fullContent || '',
      publisherId: 1, // 实际应从用户信息中获取
      status: data.status || 'inactive',
      type: data.type || 'system',
      isPinned: typeof data.isPinned === 'number' ? data.isPinned : 0,
      userIds: Array.isArray(data.receiveUserIds) && data.receiveUserIds.length ? data.receiveUserIds : [1]
    };
  } else {
    form.value = {
      title: '',
      content: '',
      publisherId: 1,
      status: 'inactive',
      type: 'system',
      isPinned: 0,
      userIds: [1]
    };
  }
};

const handleSubmit = async () => {
  try {
    // 编辑时需带上 announId，isPinned 保持 number 类型，去除多余字段
    let payload: any = {
      title: form.value.title,
      content: form.value.content,
      status: form.value.status,
      type: form.value.type,
      isPinned: form.value.isPinned,
      userIds: form.value.userIds
    };
    if (isEdit.value && props.noticeId) {
      payload.announId = props.noticeId;
      await store.updateNotice(payload);
    } else {
      payload.publisherId = form.value.publisherId;
      await store.createNotice(payload);
    }
    visible.value = false;
    emit('refresh');
  } catch (error) {
    console.error('Error submitting form:', error);
    emit('error', error);
  }
};
</script>